Welcome to WebColor! This quick quide should be all you need to get started, since WebColor is so easy to use. Here is an illustration of the main window. (The snapshot was taken with the Aaron Copland extension installed. It's a great Shareware product. Download it soon.) Scroll down to read more.
WebColor Window:
Changing colors:
As you see, each colored rectangle is labeled with a color option. To change the color for any of these, click on its rectangle and the standard color picker dialog will appear. If it doesn't, try giving WebColor more memory in its Get Info window in the Finder. If you wish not to use an option in your BODY tag output, uncheck it. The Bkgnd Pattern field works in the same way. Check its box if you wish include a background image on your web page. Then simply type the URL of the image file.
Drag 'n Drop Color Duplication:
Drag 'n Drop Color Duplication is very simple. Just click and hold the mouse in the colored rectangle you wish to duplicate. A black rectangle will appear around this rectangle. Then drag the mouse over the color you wish to replace. A gray outline will indicate this rectangle. Now, just release the mouse button, and the color is instantly duplicated.
HTML Output field:
The field on the bottom is the HTML output field. It can be typed into and supports all editing functions (except Undo.) Clicking the, "Generate HTML" button (or pressing the Enter key) will replace the field's contents with the HTML BODY tag that contains the hex equivilants of the colors you wish to use. (Whew!)
Generate HTML:
Click this button and WebColor will write out your BODY tag, including all hex values for the colors you have chosen. If it is checked out in the Preferences dialog, a full HTML shell including <HTML>,<HEAD> and <TITLE> tags will also be written.
Copy Text:
The "Copy Text" button simply copies the text in the HTML output field, regardless of your selection.
Export Text:
The "Export Text" button simply allows you to save the HTML output field to a SimpleText/TeachText file.
Size Box:
By dragging the size box, you can size WebColor's main window vertically to view more of the HTML output field.
Options Menu:
Set Default Colors:
By choosing "Set Default Colors" from the Options menu, the current color settings will be saved and used the next time you launch WebColor.
Restore Default Colors:
Choosing "Restore Default Colors" will set all the colors to those default colors that you last saved.
Pick Up Color:
This is a really cool feature with WebColor. By choosing this item from the Options menu, the cursor will change to a crosshair and wait for you to click. You can click on any pixel on the screen and that pixel's color will be entered as the currently selected color.
Show Pickup Window:
This will bring the Pickup window to the front. The Pickup window is very useful. It defaults to a continuous RGB display. When the cursor is within the Pickup winodw, it changes to a crosshair. When you click in the window, the color of the pixel you clicked is entered as the currently selected color. You can also paste a picture from the Clipboard into the Pickup window. To clear that picture and return to the continuous RGB display, choose "Clear" from the Edit menu. Or use the Delete or Clear key on your keyboard.
Tag Style:
From this submenu, choose whether HTML tags will use Titled, CAPITALIZED, or lowercase words.
Preferences:
This item brings up the Preferences dialog. There are three checkboxes:
• Full HTML Shell - When you click "Generate HTML", <HTML>, <TITLE>, and <HEAD> tags will be included.
• Clear Field First - When you click "Generate HTML", the entire HTML output field will be cleared.
Misc:
Preview:
By choosing, "Show Preview" from the File menu, you can see an example using the colors you have set so you can contrast and adjust colors to look exactly how you want them to. The preview window works also works like your web browser. To see the active link color, you can click on the Link string or Visited Link string to get the full user experience.
Get Info:
This handy little box will give the Red, Green, and Blue values for any color option. Choose from the popup menu which color you would like to get information on. You can view the color values between 65535 (Mac) ,255 (HTML) or 100 (Percentage). The color is also displayed in its hex value, so you can preview that before generating the HTML text.
There's really nothing more to it than that. I hope you enjoy WebColor and I appreciate comments.